<!DOCTYPE html>
<html>

<head>
    <title> Conditional Rendering </title>
    <script src="https://unpkg.com/react@17/umd/react.production.min.js" crossorigin></script>
    <script src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js" crossorigin></script>
    <script src="https://unpkg.com/@babel/standalone/babel.min.js" crossorigin></script>
</head>

<body>
    <div id="root"></div>
</body>

</html>
<script type="text/babel">
    class Greeting extends React.Component {
        // Way 4 : Inline If-Else with Conditional Operator
        render(){
            return (
                <div>
                    The user is {this.props.isLoginedIn ? 'currently ' : 'not'} logged in.
                    </div>
            );
        }
    }
    ReactDOM.render(<Greeting isLoginedIn={true} />, document.getElementById('root'));
</script>